<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width"/>
<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
<title></title>
<link rel="stylesheet" type="text/css" href="../../css/aui-flex.css" />
<link rel="stylesheet" type="text/css" href="../../css/aui.css" />
<link rel="stylesheet" type="text/css" href="../../css/common.css" />
<style>
.aui-content{
  padding: 0.75rem 1rem;
}
.name p{
  font-size: 0.9rem;
  text-align: center;
  line-height: 1.25rem;
}
.info{
  padding: 1.2rem 0 1.5rem;
}
.info .tit{
  text-align: center;
  font-size: 0.7rem;
  padding-bottom: 2.5rem;
}
select,
input.textInput {
		font-size: 0.7rem;
		height: 2rem;
}
.comFlexItem select,
.comFlexItem input.textInput {
		text-align: left;
		padding: 0 0.5rem;
    padding-right: 2rem;
}
.getCode{
  border-left: 1px solid #eee;
  width: 5rem;
  text-align: center;
}
.opacity{
  opacity: 0.5;
}
</style>
</head>
<body>
  <div class="aui-content">
    <div class="name">
      <p class="text-bold color-35">亲爱的</p>
      <p class="color-35 aui-font-size-16" id="name"></p>
    </div>
    <div class="info">
      <div class="tit color-35">请输入您原来手机号码<span id="mobile"></span>收到的验证码</div>
      <div class="comFlexItem aui-border-b">
        <div class="relative flex-auto">
          <input type="number" maxLength="6" name="" value="" class="textInput" id="code" onKeyUp="changeVal();">
          <div class="inputDel aui-hide" tapmode onclick="quxiao()"></div>
        </div>
        <div class="getCode ready" tapmode onclick="getCode(this)">获取验证码</div>
      </div>
    </div>
    <div class="comBtmBtn radius opacity" tapmode onclick="next()">下一步</div>
  </div>
</body>
<script type="text/javascript" src="../../script/import.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript">
var phone;
var saveBtnFlag = true;
apiready = function(){
	api.parseTapmode();
  api.ajax({
      url: BASE_URL + 'App/User/userInfo',
      method: 'post',
      data: {
          values: {
              userid: getUserId()
          }
      }
  }, function(ret, err) {
      if (ret) {
          if (ret.code == 1 && ret.data) {
            // 登录手机号
            $$('#name').text(ret.data.user_nickname);
            $$('#mobile').text(ret.data.user_mobile);
          }
      }
  });
};
// 获取验证码
var times = 59;
var isinerval;

function getCode() {
    phone = $$('#mobile').text()
    if (!$$('.getCode').hasClass('ready')) {
        return;
    }
    $$('.getCode').removeClass('ready');
    //发送验证码 接口地址
    smsUrl = 'App/User/sendSms';
    testSmsUrl = 'App/User/addCode';

    // 测试验证码 （不发送短信，console.log）
    // api.ajax({
    //   url: BASE_URL + testSmsUrl,
    //   method: 'post',
    //   data: {
    //     values: {
    //       mobile: phone
    //     }
    //   }
    // },function(ret, err){
    //   log(ret)
    //   if (ret) {
    //     if(ret.code){
    //       toast('发送成功');
    //       times = 59;
    //       isinerval = setInterval("countDown()", 1000);
    //     }else{
    //       toast('发送失败');
    //       $$('.getCode').addClass('ready');
    //     }
    //   }else{
    //     toast('发送失败，请稍候再试');
    //     $$('.getCode').addClass('ready');
    //   }
    // });
    // return;

    //正式发短信接口
    api.ajax({
      url: BASE_URL + smsUrl,
      method: 'post',
      data: {
        values: {
          mobile: phone
        }
      }
    },function(ret, err){
      if (ret) {
        if(ret.Code=='OK'){
          toast('发送成功');
          times = 59;
          isinerval = setInterval("countDown()", 1000);
        }else{
          toast(ret.Message);
          $$('.getCode').addClass('ready');
        }
      }else{
        toast('发送失败，请稍候再试');
        $$('.getCode').addClass('ready');
      }
    });
}
//倒计时
function countDown() {
    if (times < 1) {
        $$('.getCode').addClass('ready').text('重新获取');
        clearInterval(isinerval);
        return;
    }
    $$('.getCode').text(times+'s');
    times--;
}
function changeVal(){
    $$('input.textInput').each(function() {
        var _this = $$(this);
        var delBtn = _this.next('.inputDel');
        if ( _this.val()) {
            delBtn.removeClass('aui-hide');
        } else {
            delBtn.addClass('aui-hide');
        }
    });
    saveBtnFlag = true;
    code = $$('#code').val();
    if(!code){
      saveBtnFlag = false;
    }
    if(saveBtnFlag){
      $$('.comBtmBtn').removeClass('opacity');
    }else{
      $$('.comBtmBtn').addClass('opacity');
    }
}
//判断默认显示 清空按钮
changeVal();
function quxiao(){
	$$('.textInput').val('');
	changeVal();
}
function next(){
  if( $$('.comBtmBtn').hasClass('disabled') ){
    return;
  }
  phone = $$('#mobile').text()
  api.openWin({
      name: 'gh_phone_win',
      url: 'gh_phone_win.html',
      pageParam: {
          phone: phone
      }
  });


}
</script>
</html>
